<header class="site-header">
    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
        <div class="container">
            <a href="index.html" class="navbar-brand d-flex align-items-center">
                <svg class="mr-2" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" aria-hidden="true" viewBox="0 0 24 24" focusable="false" xmlns="http://www.w3.org/2000/svg">
          <path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z" />
          <circle cx="12" cy="13" r="4" />
        </svg>
                <span>{{ pkg.name | replace('[-_]', ' ', 'g') | title }}</span>
            </a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#site_menu" aria-controls="site_menu" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>
            <div class="collapse navbar-collapse" id="site_menu">
                <ul class="navbar-nav ml-auto">
                    {% for item in menus %} {% set isCurrent = current === item.name | lower %}
                    <li class="nav-item{% if item.children %} dropdown{% endif %}{% if isCurrent %} active{% endif %}">
                        <a class="nav-link{% if item.children %} dropdown-toggle{% endif %} d-flex align-items-center" href="{{ item.link }}" {% if item.children %} id="nav-{{ item.name | lower }}-dropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                            {% endif %}>{% if item.icon %}<i class="icon-{{ item.icon }} mr-1"></i> {% endif %}{{ item.name }}{% if isCurrent %} <span class="sr-only">(current)</span>{% endif %}</a> {% if item.children %}
                        <div class="dropdown-menu" aria-labelledby="nav-{{ item.name | lower }}-dropdown">
                            {% for item in item.children %} {% if item.name === 'divider' %}
                            <div class="dropdown-divider"></div>
                            {% else %}
                            <a class="dropdown-item d-flex align-items-center" href="{{ item.link }}" target="_brank">{{ item.name }}</a> {% endif %} {% endfor %}
                        </div>
                        {% endif %}
                    </li>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </nav>
</header>